<template>
    <view>
        <!--#ifdef APP-PLUS-->
        <view class="lz-status_bar">
            <view class="lz-top_view"></view>
        </view>
        <!--#endif-->
        <view class="kaoshi-auth-top" @click="toMain">随便逛逛></view>
        <image :src="static_media.img01" class="kaoshi-auth-img"></image>
        <view class="kaoshi-auth-flex">
            <view class="kaoshi-auth-button kaoshi-auth-login" @click="$openrul('/pages/auth/login/index?form_type=0')">
                登录
            </view>
            <view class="kaoshi-auth-button" @click="$openrul('/pages/auth/login/index?form_type=1')">立即注册</view>
        </view>
        <!--                    <view class="login-weixin">-->
        <!--                        <view class="login-weixin-title">其他登录方式</view>-->
        <!--                        <view class="iconfont icon-weixin" @tap="weixin_login"></view>-->
        <!--                    </view>-->
        <!--	APP中弹出用户与隐私协议	-->
        <!-- #ifdef APP-PLUS -->
        <block v-if="xieyi">
            <view class="kaoshi-box-bg"></view>
            <view class="kaoshi-box">
                <view class="kaoshi-box-flex">
                    <view class="kaoshi-box-content">
                        <view class="kaoshi-box-content-title">用户协议和隐私政策</view>
                        <view class="kaoshi-box-content-about">亲爱的用户，感谢您信任并使用企业培训考试系统，
                            我们将依据相关法律制定了
                            <view class="kaoshi-box-content-blue">《用户协议》</view>
                            <view class="kaoshi-box-content-float">及</view>
                            <view class="kaoshi-box-content-blue">《隐私政策》</view>
                            来帮助您了解我们在收集、使用、存储和共享您个人信息的情况以及您享有的相关权利。

                            在您使用企业培训考试系统资料共享服务时，我们将收集您的设备信息、地理位置信息。

                            在您使用企业培训考试系统的资料上传、发帖、下载等服务时，我们需要获取您设备上的相机权限信息。

                            您可以在相关页面访问、修改、删除您的个人信息或管理您的授权、

                            我们会采用行业内领先的安全技术来保护您的个人信息。
                        </view>
                        <view class="kaoshi-box-content-flex">
                            <view class="kaoshi-box-content-flex-button active" @tap="refuse_xieyi">不同意</view>
                            <view class="kaoshi-box-content-flex-button" @tap="confirm_xieyi">同意</view>
                        </view>
                    </view>
                </view>
            </view>
        </block>
        <!-- #endif -->
    </view>
</template>

<script>
    import {mapState} from 'vuex'

    export default {
        data() {
            return {
                xieyi: false,//APP中用户协议与隐私政策的显示与隐藏
            }
        },
        onShow() {
            //判断是否弹出用户协议
            this.xieyi = !this.$myCatch.getItem("showxieyi");
        },
        onReady() {
            this.checkToken();
        },
        computed: {
            ...mapState(["userinfo", "forcedLogin", "subject"]),
            static_media() {
                return {
                    img01: this.$myConfig.localMedia + '/static/img/auth-top.jpg'
                }
            }
        },
        methods: {
            async checkToken() {
                if (!this.userinfo.token) {
                    return
                }
                // 检查token是否过期
                let res = await this.$myHttp.post({
                    url: this.$myHttp.urlMap.checkToken,
                    data: {
                        token: this.userinfo.token
                    },
                    needLogin: true
                });
                if (res.code === 1) {
                    this.$store.commit('setUserInfo', {userinfo: {...this.userinfo, token: res.data.token}});
                    uni.switchTab({
                        url: '/pages/index/index'
                    })
                }
            },
            weixin_login() {
                /*let that = this;
                uni.showLoading({
                    title: '登陆中',
                    mask: true
                });
                uni.login({
                    provider: "weixin",
                    success: function(loginRes) {
                        // 获取用户信息
                        uni.getUserInfo({
                            provider: "weixin",
                            success: async function(infoRes) {
                                let rawData = JSON.parse(infoRes.rawData || '');

                                if (rawData && rawData.openId) {
                                    // 调用微信登录接口
                                    let res = await that.$myHttp.post({
                                        url: that.$myHttp.urlMap.wx_login,
                                        data: {
                                            openid: rawData.openId
                                        }
                                    });

                                    uni.hideLoading();
                                    console.log(res)
                                    if(res.data.is_bind == '0'){
                                        that.rawData = rawData;
                                        that.showmodal = true;
                                    }else{
                                        if (res.code == 1) {
                                            console.log('微信授权登录成功')
                                            that.$store.commit('setUserInfo', { userinfo: res.data.userinfo });
                                            that.$myUtils.$router.switchTab({
                                                url: "/pages/index/index"
                                            });
                                        }
                                    }
                                }

                            }
                        });
                    }
                });*/
            },
            //同意用户协议——隐藏弹框
            confirm_xieyi() {
                this.$myCatch.setItem("showxieyi", 'false');
                this.xieyi = !this.$myCatch.getItem("showxieyi");
            },
            //拒绝用户协议——退出
            refuse_xieyi() {
                // #ifdef APP-PLUS
                plus.runtime.quit();
                // #endif
            },
            toMain() {
                // 判断是否选择了科目
                if (this.subject && this.subject.id && this.subject.id !== 0) {
                    // 进入首页
                    this.$myUtils.$router.switchTab({
                        url: "/pages/index/index"
                    });
                } else {
                    // 进入选择科目
                    this.$myUtils.$router.navigateTo({
                        url: "/pages/auth/choiceSubject/index"
                    });
                }
            },
        }
    }
</script>

<style>
    page {
        background: #fff;
    }

    .kaoshi-auth-img {
        width: 100%;
        height: 320px;
    }

    .kaoshi-auth-top {
        font-size: 14px;
        text-align: right;
        padding: 9px;
        color: #5374bf;
    }

    .kaoshi-auth-flex {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 18px;
        position: absolute;
        bottom: 30%;
        width: 100%;
    }

    .kaoshi-auth-button {
        color: #3c7bfc;
        border: solid 1px #3e7afb;
        padding: 10px 26px;
        border-radius: 23px;
        margin-bottom: 18px;
        width: 62%;
    }

    .kaoshi-auth-login {
        background: #3c7bfc;
        border: solid 1px #3c7bfc !important;
        color: #fff;
        box-shadow: 0 2px 11px rgba(0, 100, 204, 0.27);
    }

    /*弹窗*/
    .kaoshi-box-bg {
        background: rgba(19, 19, 19, 0.42);
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }

    .kaoshi-box {
        position: absolute;
        top: 21%;
        z-index: 1;
        left: 10%;
        right: 0;
        background: #fff;
        width: 80%;
        border-radius: 8px;
    }

    .kaoshi-box-flex {
        position: relative;
    }

    .kaoshi-box-content {
        padding: 20px;
    }

    .kaoshi-box-content-title {
        text-align: center;
        font-size: 18px;
        font-weight: bold;
        padding-bottom: 9px;
    }

    .kaoshi-box-content-about {
        padding-bottom: 9px;
        line-height: 22px;
        font-size: 14px
    }

    .kaoshi-box-content-flex {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .kaoshi-box-content-flex-button {
        background: #3c7bfc;
        border: solid 1px #3c7bfc;
        color: #fff;
        padding: 8px 0;
        font-size: 16px;
        border-radius: 27px;
        flex: 1;
        text-align: center;
    }

    .kaoshi-box-content-flex .active {
        background: #fff;
        border: solid 1px #eeeeee;
        color: #000;
        margin-right: 6px;
    }

    .kaoshi-box-content-float {
        float: left
    }

    .kaoshi-box-content-blue {
        float: left;
        color: #3c7bfc;
    }

    /*此处为微信登录，已注释*/
    .login-weixin {
        position: fixed;
        bottom: 8%;
        left: 0;
        right: 0;
    }

    .login-weixin .login-weixin-title {
        font-size: 14px;
        color: #a9a9a9;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .login-weixin-title:before {
        content: "";
        position: absolute;
        width: 30%;
        height: 1px;
        top: 10px;
        background-color: #ededed;
        left: 6%;
    }

    .login-weixin-title:after {
        content: "";
        position: absolute;
        width: 30%;
        height: 1px;
        top: 50%;
        background-color: #ededed;
        right: 6%;
    }

    .login-weixin .icon-weixin {
        color: #46bb36;
        font-size: 36px;
        margin-top: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>
